<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>人员信息维护</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/layuiMini/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="/layuiMini/css/public.css" media="all">
    <style>
        /*修改选中框选中后的样式*/
        .layui-form-checked[lay-skin=primary] i{
            border-color:#1E9FFF!important;
            background-color:#1E9FFF;
            color:#fff}
        /*select下拉框部分样式修改*/
        .layui-form-select dl dd.layui-this {
            background-color: #1E9FFF;!important;
            color: #fff;
        }
        /*修改按钮悬浮颜色*/
        .layui-btn-primary:hover {
            border-color:#1E9FFF!important;
            color: #333;
        }
        /*修改输入框在鼠标悬浮时的样式*/
        .layui-input:hover, .layui-textarea:hover {
            border-color:#1E9FFF!important;
        }
        /*修改输入框得到焦点时的样式*/
        .layui-input:focus, .layui-textarea:focus {
            border-color: #1E9FFF!important;
        }
        /*!*layui表格悬浮变色*!*/
        .layui-table tbody tr:hover{
            background-color: #87CEFA;!important;
        }
    </style>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <fieldset class="table-search-fieldset">
            <legend>班组查询</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane">
                    <div class="layui-form-item">
                        <div class="layui-inline myInline" style="width: 300px">
                            <label class="layui-form-label">工号</label>
                            <div class="layui-input-inline" style="width: 50%">
                                <input type="text" id="jobNumber" name="jobNumber" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline" style="width: 300px">
                            <label class="layui-form-label">姓名</label>
                            <div class="layui-input-inline" style="width: 50%">
                                <input type="text" id="username" name="username" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn layui-btn-primary" type="reset">重 置</button>
                            <button class="layui-btn  layui-btn-normal" id="searchBtn"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>
        <table class="layui-hide" id="departmentManageTable" lay-filter="departmentManageFilter"></table>
    </div>
</div>
<script src="/layuiMini/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<!--行工具栏-->
<script type="text/html" id="currentTableBar">
    <a class="layui-btn layui-btn-xs layui-btn-normal " lay-event="userUpdate">修改</a>
    <a class="layui-btn layui-btn-xs layui-btn-danger " lay-event="userDelete">删除</a>
</script>
<!--头部工具栏-->
<button type="button" class="layui-btn lafite_main_color" id="newUsers" style="display: none"><i class="layui-icon"></i>上传文件</button>
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="userAdd"> 添加员工 </button>
        <button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="uploadUser"> 上传文件 </button>
        <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="exportExcel"> 导出Excel </button>
    </div>
</script>
<script>
    var teamPageData;
    layui.use(['form','table','laydate','upload'], function () {
        var $ = layui.jquery,
            form = layui.form,
            laydate = layui.laydate,
            upload = layui.upload,
            table = layui.table;
        upload.render({
            elem: '#newUsers',
            url: 'uploadNewUser',
            accept: 'file',
            exts: 'xls|xlsx|xlsm|xlt',
            size: 30000,
            done: function (res) {
                //如果上传失败
                if (res.respCode == "0000") {
                    layer.msg(res.data.msg,{icon:6})
                    setTimeout(function (){
                        location.reload();
                    }, 1500);
                }else{
                    layer.msg(res.data.msg,{icon:5})
                }
            }
        })
        $.ajax({
            url: 'teamSearchInfo',
            dataType:'json',
            type:'get',
            success: function (res){
                $.each(res.data.data, function (index, value) {
                    $('#teamOffice').append(new Option(value.office,value.departmentNumber));// 下拉菜单里添加元素
                });
                layui.form.render("select");
            }
        })
        table.render({
            elem: '#departmentManageTable',
            url: '/userManage/getUserTableData',
            toolbar: '#toolbarDemo',
            id: 'departmentManageReload',
            page:{
                group:5,
                limit: 10,
                limits:[10,15,20,25,50,100],
                theme:'#1E9FFF',
                // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip']//表格左下角工具栏布局
            },
            parseData: function(res){
                return{
                    "code" : res.data.code,
                    "count" : res.data.count,
                    "data" : res.data.data
                }
            },
            response:{
                statusName : 'code',
                statusCode : 0,
                dataName : 'data'
            },
            defaultToolbar: false,
            cols: [
                    [
                        {field:'aa',type: "numbers",title: "序号"},
                        {field: 'jobnumber', title: '工号'},
                        {field: 'username', title: '姓名', sort: true},
                        {field: 'factory', title: '工厂', sort: true},
                        {field: 'department', title: '部门', sort: true},
                        {field: 'office', title: '科室'},
                        {field: 'status', title: '部门主键',hide: true},
                        {title: '操作',toolbar: '#currentTableBar', align: "center"}
                ]
            ],
            done: function (res,curr,count){
                $('th').css({'background-color' : '#87CEFA','text-align': 'center'})
                if(res.count <= 0){
                    $("[lay-id=departmentManageReload] .layui-table-main").html('<div class="layui-none">'+"无相关部门信息"+'</div>');
                }
            },
            // skin: 'line'//取消单元格边框线
        });

        // 监听搜索操作
        $(document).on('click',"#searchBtn",function (data){
            let jobNumber = $("#jobNumber").val().trim();
            let username = $("#username").val().trim();
            //执行搜索重载
            table.reload('departmentManageReload', {
                page: {
                    curr: 1,
                    theme:'#1E9FFF'
                },
                where: {
                    jobnumber : jobNumber,
                    username : username,
                },
                done:function (res,curr,count){
                    $('th').css({'background-color' : '#87CEFA','text-align': 'center'})
                    if(res.count <= 0){
                        layer.msg("无相关班组信息",{icon:6,time: 2000});
                        $("[lay-id=departmentManageReload] .layui-table-main").html('<div class="layui-none">'+"无相关部门信息"+'</div>');
                    }
                    teamPageData = res.data;
                }
            });
            return false;
        });

        /**
         * toolbar监听事件，头部工具栏监听事件
         */
        table.on('toolbar(departmentManageFilter)', function (obj) {
            console.log(obj.event)
            if (obj.event === 'userAdd') {  // 监听批量维护操作
                var index = layer.open({
                    title: '添加用户',
                    type: 2,
                    shade: 0.2,
                    maxmin:true,
                    shadeClose: false,
                    area: ['80%', '90%'],
                    content: 'addUserPage?pageType=1',
                });
            } else if (obj.event === 'uploadUser') {  // 监听上传文件
                $("#newUsers").click();
            }else if(obj.event === 'exportExcel'){//导出文件
                exportUserExcel()
            }
        });

        /**
         * 行工具栏监听事件
         */
        table.on('tool(departmentManageFilter)', function (obj) {
            var checkStatus = obj.data;
            window.myApplyList = checkStatus;
            var eventName = obj.event;
            if(eventName == 'userUpdate'){
                var index = layer.open({
                    title: '信息修改',
                    type: 2,
                    shade: 0.2,
                    maxmin:true,
                    shadeClose: false,
                    area: ['80%', '90%'],
                    content: 'addUserPage?pageType=2' + "&jobNumber=" + checkStatus.jobnumber,
                });
            } else if(eventName == 'userDelete'){
                layer.confirm("您确认要删除该员工吗？",function (index){
                    let deleteParams = {
                        jobNumber: checkStatus.jobnumber,
                    }
                    $.ajax({
                        url:"userDeleteAction",
                        type:"post",
                        data:deleteParams,
                        dataType: "json",
                        success:function(res){
                            if(res.respCode == "0000"){
                                layer.msg(res.data.msg,{icon:6,time:1500});
                                setTimeout(function (){
                                    location.reload();
                                },1500)
                            }else{
                                layer.msg(res.data.msg,{icon:5,time:1500});
                            }
                        }
                    })
                    return false;
                });
            }
        });

        //导出Excel
        function exportUserExcel(){
            let  userParams = {};
            let jobNumber = $("#jobNumber").val().trim();
            let username = $("#username").val().trim();
            if(jobNumber != "" && jobNumber != null){
                userParams.jobnumber = jobNumber;
            }
            if(username != "" && username != null){
                userParams.username = username;
            }
            var urlLink = '';
            $.each(userParams,function(item,key){
                var link = '&' + item + "=" + key;
                urlLink += link;
            })
            urlLink = '/userManage/exportUserExcel?' + urlLink.substr(1) + "&ExcelId=5";
            location.href = urlLink;
        }
    });
</script>
</body>
</html>